import React from "react";

const ViewsIcon = ({ color = "#8591a5" }) => {
  return (
    <svg
      width="12"
      height="11"
      viewBox="0 0 14 9"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <mask id="path-1-inside-1_34_4206" fill="white">
        <path
          fillRule="evenodd"
          clipRule="evenodd"
          d="M0.604922 4.98987C0.403828 4.69384 0.403828 4.30616 0.604922 4.01013C2.04404 1.89167 4.47307 0.5 7.22714 0.5C9.98121 0.5 12.4102 1.89167 13.8494 4.01014C14.0504 4.30616 14.0504 4.69385 13.8494 4.98987C12.4102 7.10833 9.98121 8.5 7.22714 8.5C4.47307 8.5 2.04404 7.10833 0.604922 4.98987Z"
        />
      </mask>
      <path
        d="M13.8494 4.01014L13.0222 4.57206L13.8494 4.01014ZM13.8494 4.98987L13.0222 4.42794L13.8494 4.98987ZM1.43211 4.57206C2.69303 2.71591 4.81825 1.5 7.22714 1.5V-0.5C4.12789 -0.5 1.39505 1.06743 -0.222266 3.44821L1.43211 4.57206ZM7.22714 1.5C9.63603 1.5 11.7612 2.71591 13.0222 4.57206L14.6765 3.44821C13.0592 1.06743 10.3264 -0.5 7.22714 -0.5V1.5ZM13.0222 4.42794C11.7612 6.28409 9.63603 7.5 7.22714 7.5V9.5C10.3264 9.5 13.0592 7.93257 14.6765 5.55179L13.0222 4.42794ZM7.22714 7.5C4.81825 7.5 2.69303 6.28409 1.43211 4.42794L-0.222266 5.55179C1.39505 7.93257 4.12789 9.5 7.22714 9.5V7.5ZM13.0222 4.57206C12.9928 4.5289 12.9928 4.47111 13.0222 4.42794L14.6765 5.55179C15.1081 4.91659 15.1081 4.08342 14.6765 3.44821L13.0222 4.57206ZM-0.222266 3.44821C-0.653776 4.08342 -0.653776 4.91658 -0.222266 5.55179L1.43211 4.42794C1.46143 4.4711 1.46143 4.5289 1.43211 4.57206L-0.222266 3.44821Z"
        fill={color}
        mask="url(#path-1-inside-1_34_4206)"
      />
      <circle cx="7.22705" cy="4.5" r="3.5" stroke={color} />
      <circle cx="7.22705" cy="4.5" r="1" fill={color} />
    </svg>
  );
};

export default ViewsIcon;
